<template>
  <div class="yn_pagintation">
    <el-pagination
      @size-change="onSizeChange"
      @current-change="onCurrentChange"
      :page-sizes="pageSizes"
      :page-size="props_page_sizes"
      layout="total, sizes, prev, pager, next, jumper"
      :total="total1"
      :current-page.sync="currentPage1"
      style="text-align: right; margin-top: 10px;">
    </el-pagination>
  </div>
</template>

<script>
  import commondef from '@/utils/common'

  export default {
    name: 'yn_pagintation',
    props: ['total', 'props_page_sizes','currentPage'],
    computed: {
      total1: {
        set () {
        },
        get () {
          return this.total
        }
      },
      currentPage1: {
        set () {
        },
        get () {
          return this.currentPage
        }
      }
    },
    data () {
      return {
        pageSizes: [10,15, 30, 50, 100],
        page: {
          page_size: commondef.globlePagesize,
          page_no: 1
        }
      }
    },
    methods: {
      onSizeChange (val) {
//        console.log('value123123123', value[(value.length - 1)])
        this.$emit('changeSize', val)
      },
      onCurrentChange (val) {
        this.$emit('changeCurrent', val)
      },
      defaultFunc () {
        console.log('this.props_page_sizes`````', this.props_page_sizes)
        console.log('this.props_page_sizes``````````````', this.props)
        if (this.props_page_sizes === undefined) {
          this.pageSizes = [10,15, 30, 50, 100]
        } else {
          this.pageSizes = [10,15, 30, 50, 100]
        }
      }
    },
    mounted () {
      this.defaultFunc()
    }
  }
</script>
<style>
  .areacomponent,
  .el-cascader {
    width: 100%;
  }
</style>
